﻿@using hc.epm.UI.Common;
@using hc.epm.DataModel.Basic;
@model Base_User
@{
    ViewBag.Title = "会员添加";
}
<style>
    .btn-group {
        margin-top: 0px !important;
        text-align: left !important;
    }

    .info-tittle {
        width: 100%;
        height: 33px;
        background-color: #d2d1d1;
        line-height: 33px;
        padding-left: 25px;
        box-sizing: border-box;
        font-weight: 600;
        margin-bottom: 20px;
    }
</style>
<div class="content-right date-wrap fl c">
    <div class="top-url">
        <span><a href="/home/welcome" target="mainFrame">首页</a> </span> > <span> <a href="">用户管理</a> </span> > <span> 新增用户信息</span>
    </div>
    <div class="main mt5 pd-t-b" style="padding:0 0 15px 0 ">
        <div class="container" style="max-width:100%;width:100%;padding-top:0">
            <div class="row">
                <form class="form-horizontal " id="mainForm">
                    <div class="info-tittle">
                        <span style="padding-right:20px">></span>
                        <label>用户信息</label>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <input type="hidden" name="PassTime" value="@ViewBag.currentTime" />
                        <input type="hidden" name="LastLoginTime" value="@ViewBag.currentTime" />
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required">*</em>用户编码 : </label>
                            <div class="col-lg-3 col-sm-3">
                                <input type="text" name="UserCode" class="form-control" id="UserCode" placeholder="请输入编码" value="@ViewBag.Code" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required">*</em>性别：</label>
                            <div class="col-lg-6 col-sm-6" style="margin-left:0px;">
                                <div class="radio radio-success radio-inline">
                                    <input type="radio" id="inlineRadio1" value=true name="Sex" checked>
                                    <label for="inlineRadio1"> 男 </label>
                                </div>
                                <div class="radio radio-success radio-inline">
                                    <input type="radio" id="inlineRadio2" value=false name="Sex">
                                    <label for="inlineRadio2">女  </label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required">*</em>登录账号：</label>
                            <div class="col-lg-3 col-sm-3">
                                <input type="text" name="UserAcct" id="UserAcct" class="form-control" placeholder="请输入登录账号" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required">*</em>用户名称 : </label>
                            <div class="col-lg-3 col-sm-3">
                                <input type="text" name="UserName" class="form-control" id="UserName" placeholder="请输入用户名称" value="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required">*</em>联系电话：</label>
                            <div class="col-lg-3 col-sm-3">
                                <input type="text" name="Phone" id="Phone" placeholder="请输入电话" class="form-control" value="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required">*</em>所属单位：</label>
                            <div class="col-lg-3 col-sm-3">
                                <input type="text" name="CompanyName" class="form-control" id="CompanyName" placeholder="请选择所属单位" value="" />
                                <input type="hidden" name="CompanyId" class="form-control" id="CompanyId" value="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px;display:none;">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label">微信：</label>
                            <div class="col-lg-6 col-sm-6">
                                <input type="text" name="WebChat" id="WebChat" placeholder="请输入微信" autocomplete="off" class="form-control" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px;display:none;">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label">QQ：</label>
                            <div class="col-lg-6 col-sm-6">
                                <input type="text" name="QQ" id="QQ" placeholder="请输入QQ" autocomplete="off" class="form-control" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>电子邮箱：</label>
                            <div class="col-lg-3 col-sm-3">
                                <input type="text" name="Email" id="Email" placeholder="请输入电子邮箱" class="form-control" value="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>出生日期：</label>
                            <div class="col-lg-3 col-sm-3">
                                <input type="text" name="BirthDate" id="BirthDate" style="text-align: left;border-radius: 4px;" placeholder="请选择出生日期" autocomplete="off" class="btn btn-default form-control" value="" onclick="WdatePicker({dateFmt: 'yyyy-MM-dd'})" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>毕业院校：</label>
                            <div class="col-lg-3 col-sm-3">
                                <input type="text" name="University" id="University" placeholder="请输入毕业院校" class="form-control" value="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>专业名称：</label>
                            <div class="col-lg-3 col-sm-3">
                                <input type="text" name="Major" id="Major" placeholder="请输入专业名称" class="form-control" value="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>学历：</label>
                            <div class="col-lg-3 col-sm-3">
                                <select name="Education" id="Education" lay-filter="Education" class="form-control">
                                    <option value="">请选择学历</option>
                                    <option value="本科">本科</option>
                                    <option value="大专">大专</option>
                                    <option value="高中">高中</option>
                                    <option value="中专">中专</option>
                                    <option value="初中">初中</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-lg-2 col-sm-2 control-label" style="text-align:right"><em class="required"></em>现在住址：</label>
                        <div class="col-lg-9 col-sm-9">
                            <div class="col-lg-2 col-sm-2" style="padding-left:10px;">
                                <select name="Province" id="Province" lay-filter="Province" class="form-control">
                                    <option value="610000">陕西省</option>
                                </select>
                            </div>
                            <div class="col-lg-2 col-sm-2" style="padding-left:10px;">
                                <select name="City" id="City" lay-filter="City" class="form-control">
                                    <option value="">请选择市</option>
                                </select>
                            </div>
                            <div class="col-lg-2 col-sm-2" style="padding-left:10px;">
                                <select name="Country" id="Country" lay-filter="Country" class="form-control">
                                    <option value="">请选择县</option>
                                </select>
                            </div>
                        </div>
                        <input type="hidden" name="Address" id="Address" class="form-control" />
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>职称：</label>
                            <div class="col-lg-3 col-sm-3">
                                @Html.DropDownList("Professional", null, new { @class = "form-control selectpicker  show-tick" })
                                <input type="hidden" name="ProfessionalValue" id="ProfessionalValue" value="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>岗位：</label>
                            <div class="col-lg-3 col-sm-3">
                                @Html.DropDownList("Post", null, new { @class = "form-control selectpicker  show-tick" })
                                <input type="hidden" name="PostValue" id="PostValue" value="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>职业资质：</label>
                            <div class="col-lg-3 col-sm-3">
                                @Html.DropDownList("ProfessionalQualification", null, new { @class = "form-control selectpicker  show-tick" })
                                <input type="hidden" name="ProfessionalQualificationValue" id="ProfessionalQualificationValue" value="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:60px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>开始职业日期：</label>
                            <div class="col-lg-3 col-sm-3">
                                <input type="text" name="OccupationalStartTime" id="OccupationalStartTime" style="text-align: left;border-radius: 4px;" placeholder="请选择开始职业日期" autocomplete="off" class="btn btn-default form-control" value="" onclick="WdatePicker({dateFmt: 'yyyy-MM-dd'})" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12" style="height:110px">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>职业简述：</label>
                            <div class="col-lg-6 col-sm-6">
                                <textarea name="OccupationalContent" id="OccupationalContent" placeholder="请输入职业简述" class="form-control" rows="4"></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>签名：</label>
                            <div class="col-lg-6 col-sm-6">
                                <table class="layui-table">
                                    <thead>
                                        <tr>
                                            <th class="table-center">附件名称</th>
                                            <th width="90" class="table-center">附件格式</th>
                                            <th width="100" class="table-center">大小</th>
                                            <th width="100" class="table-center">上传时间</th>
                                            <th width="70" class="table-center">操作</th>
                                        </tr>
                                    </thead>
                                    <tbody id="QM"></tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>&nbsp;</label>
                            <div class="col-lg-6 col-sm-6">
                                <input type="button" id="btnUploadFileQM" name="QM" value="上传签名" />&nbsp;&nbsp;&nbsp;<span style="color:red;">建议签名图片大小≤6M，分辨率为200*100的透明图片；</span>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>职业证书/岗位证书：</label>
                            <div class="col-lg-6 col-sm-6">
                                <table class="layui-table">
                                    <thead>
                                        <tr>
                                            <th class="table-center">附件名称</th>
                                            <th width="90" class="table-center">附件格式</th>
                                            <th width="100" class="table-center">大小</th>
                                            <th width="100" class="table-center">上传时间</th>
                                            <th width="70" class="table-center">操作</th>
                                        </tr>
                                    </thead>
                                    <tbody id="ZYZZ"></tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>&nbsp;</label>
                            <div class="col-lg-6 col-sm-6">
                                <input type="button" id="btnUploadFileZYZZ" name="ZYZZ" value="上传附件" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>身份证正反面：</label>
                            <div class="col-lg-6 col-sm-6">
                                <table class="layui-table">
                                    <thead>
                                        <tr>
                                            <th class="table-center">附件名称</th>
                                            <th width="90" class="table-center">附件格式</th>
                                            <th width="100" class="table-center">大小</th>
                                            <th width="100" class="table-center">上传时间</th>
                                            <th width="70" class="table-center">操作</th>
                                        </tr>
                                    </thead>
                                    <tbody id="SFZ"></tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>&nbsp;</label>
                            <div class="col-lg-6 col-sm-6">
                                <input type="button" id="btnUploadFileSFZ" name="SFZ" value="上传附件" />
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>照片：</label>
                            <div class="col-lg-6 col-sm-6">
                                <table class="layui-table">
                                    <thead>
                                        <tr>
                                            <th class="table-center">附件名称</th>
                                            <th width="90" class="table-center">附件格式</th>
                                            <th width="100" class="table-center">大小</th>
                                            <th width="100" class="table-center">上传时间</th>
                                            <th width="70" class="table-center">操作</th>
                                        </tr>
                                    </thead>
                                    <tbody id="CZ"></tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 col-sm-12">
                        <div class="form-group">
                            <label class="col-lg-2 col-sm-2 control-label"><em class="required"></em>&nbsp;</label>
                            <div class="col-lg-6 col-sm-6">
                                <input type="button" id="btnUploadFileCZ" name="CZ" value="上传附件" />
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item row btn-save" style="margin-top:60px">
                        <input type="button" name="save" id="save" lay-submit lay-filter="sub" value="保&nbsp;&nbsp;&nbsp;存" class="layui-btn layui-btn-small button-base bg-save" />
                        <input type="button" name="close" value="关&nbsp;&nbsp;&nbsp;闭" class="layui-btn layui-btn-small button-base bg-cancel cancel" />
                        <input type="file" id="loadFile" name="loadFile" style="display:none" onchange="uploadFile()" fileListId="" />
                        <input type="hidden" name="fileDataJsonFile" id="fileDataJsonFile" />
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<script>
    var fileDataArray = [];
    function uploadFile() {
        if ($("#loadFile")[0].files.length == 0) {
            return;
        }
        var fileObj = $("#loadFile")[0].files[0]; // js 获取文件对象
        var formFile = new FormData();
        formFile.append("file", fileObj);
        var path = formFile;

        var column = $("#loadFile").attr("fileListId");

        if (fileObj.size > 6291456) {
            layer.alert("文件大小不能超过6M", { icon: 2 });
        }
        else {
            $.ajax({
                url: "/Upload/UploadHB",
                type: "POST",
                data: path,
                contentType: false,
                processData: false,
                success: function (data) {
                    for (var i = 0; i < data.length; i++) {
                        var obj = {};
                        obj.Name = data[i].Name;
                        obj.GuidId = data[i].GuidId;
                        obj.Size = data[i].Size;
                        obj.ImageType = data[i].ImageType;
                        obj.Group = data[i].ResponseObject.FDFS_GROUP;
                        obj.Url = data[i].ResponseObject.FDFS_NAME;
                        obj.TableColumn = column;
                        fileDataArray.push(obj);

                        if (data[i].ImageType == null) {
                            var name = obj.Name;
                            var type = name.split(".");
                            var odiv = '<tr>';
                            odiv += '<td style=\"text-align:center \">' + type[0] + '</td>';
                            odiv += '<td>' + '.' + type[1] + '</td>';
                            odiv += '<td>' + obj.Size + '</td>';
                            odiv += '<td>' + new Date().toLocaleDateString() + '</td>';
                            odiv += '<td style=\"text-align:center\"><a class=\"delete-file\" data-val=' + obj.GuidId + ' style="color:red;cursor:pointer">删除</a></td></tr>';
                            $("#" + column).append(odiv);
                            if (column == "QM" && $("#QM").children().length == 1) {
                                $("#btnUploadFileQM").attr("disabled", true);
                            }
                        }
                    }
                    fileDataJson = JSON.stringify(fileDataArray);
                    $("#fileDataJsonFile").val(fileDataJson);
                }
            });
        }
    }

    $(function () {
        $('#btnUploadFileQM,#btnUploadFileZYZZ,#btnUploadFileSFZ,#btnUploadFileCZ').click(function () {
            $("#loadFile").attr("fileListId", $(this).attr("name"));
            document.getElementById("loadFile").click();
        });

        var value1 = $('#Professional option:selected').text();
        $("#ProfessionalValue").val(value1);
        $("#Professional").change(function () {
            var value = $('#Professional option:selected').text();
            $("#ProfessionalValue").val(value);
        });
        
        var value2 = $('#Post option:selected').text();
        $("#PostValue").val(value2);
        $("#Post").change(function () {
            var value = $('#Post option:selected').text();
            $("#PostValue").val(value);
        });

        var value3 = $('#ProfessionalQualification option:selected').text();
        $("#ProfessionalQualificationValue").val(value3);
        $("#ProfessionalQualification").change(function () {
            var value = $('#ProfessionalQualification option:selected').text();
            $("#ProfessionalQualificationValue").val(value);
        });
    });
    //自定义验证规则
    window.onload = function () {
        $('#mainForm').bootstrapValidator({
            excluded: [':hidden'],//[':disabled', ':hidden', ':not(:visible)'] //设置隐藏组件可验证
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                UserCode: {
                    validators: {
                        notEmpty: {
                            message: '用户编码不能为空'
                        }, stringLength: {
                            max: 50,
                            message: '用户编码长度不能超过50字符'
                        },
                    }
                },
                UserAcct: {
                    validators: {
                        notEmpty: {
                            message: '登录账号不能为空'
                        },
                        stringLength: {
                            max: 20,
                            message: '登录账号长度不能超过20字符'
                        },
                    }
                },
                UserName: {
                    validators: {
                        notEmpty: {
                            message: '用户名称不能为空'
                        }, stringLength: {
                            max: 20,
                            message: '用户名称长度不能超过20字符'
                        },
                    }
                },
                Phone: {
                    validators: {
                        notEmpty: {
                            message: "联系电话不能为空"
                        },
                        regexp: {
                            regexp: /^(0|86|17951)?1[356789][0-9]{9}$/,
                            message: "联系电话格式有误"
                        }
                    }
                },
                CompanyName: {
                    validators: {
                        notEmpty: {
                            message: "所属单位不能为空"
                        },
                    }
                },               
                Email: {
                    validators: {
                        emailAddress: {
                            message: '邮箱格式不正确'
                        }, stringLength: {
                            max: 50,
                            message: '邮箱长度不能超过50字符'
                        },
                    }
                },
            }
        });
    }

    //选择单位
    $("#CompanyName").click(function () {
        layer.open({
            type: 2,
            title: GetLayerTitle("选择单位"),
            area: ['750px', '650px'],
            content: ['/User/SelectCompany?name=', 'no'],
            end: function () {
                console.log($("#CompanyId").val() + "-" + $("#CompanyName").val());
            }
        });
    });

    layui.use(['layer', 'form', 'element'], function () {
        var layer = layui.layer, form = layui.form, element = layui.element, laypage = layui.laypage;

        //监听提交
        form.on('submit(sub)', function (data) {
            //对表单进行验证
            var bv = $('#mainForm').data('bootstrapValidator');
            bv.validate();
            if (bv.isValid()) {
                var search = $("form").serialize();
                $.post("Add", search, function (data) {
                    if (data.Flag) {
                        $("#save").attr("disabled", "disabled");
                        $("#save").val("请等待")
                        var layerIndex = parent.layer.msg("会员添加成功", { time: 1000, icon: 1 }, function () {
                            var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                            parent.layer.close(index);//关闭窗口
                            parent.layer.close(layerIndex);
                            window.location.href = "/User/Index";//跳转新增页面
                        });
                    } else {
                        layer.alert(data.Message, { icon: 2 });
                    }
                });
            }
            return false;
        });

        //删除附件
        $("#SFZ,#CZ,#ZYZZ").on('click', 'a.delete-file', function () {
            $(this).parents("tr").remove();
            var toremove = '';
            var id = $(this).data("val");
            //删除初始文件对应的值
            fileDataArray = fileDataArray.filter(function (item, index, arr) {
                return item.GuidId != id
            })
            fileDataJsonFile = JSON.stringify(fileDataArray);
            $("#fileDataJsonFile").val(fileDataJsonFile);
        });
        //删除签名附件
        $("#QM").on('click', 'a.delete-file', function () {
            $(this).parents("tr").remove();
            $("#btnUploadFileQM").removeAttr("disabled");
            var toremove = '';
            var id = $(this).data("val");
            //删除初始文件对应的值
            fileDataArray = fileDataArray.filter(function (item, index, arr) {
                return item.GuidId != id
            })
            fileDataJsonFile = JSON.stringify(fileDataArray);
            $("#fileDataJsonFile").val(fileDataJsonFile);
        });

        //关闭弹出iframe层
        $('.cancel').on("click", function () {
            var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
            parent.layer.close(index);//关闭窗口
        });

        $("#Province").change(function () {
            var value = this.value
            $.post("/Organization/RegionList", { parentCode: value }, function (data) {
                if (data.Flag) {
                    $("#City").empty();
                    $("#City").append("<option value=''>请选择市</option>")
                    $("#Country").empty();
                    $("#Country").append("<option value=''>请选择县</option>")
                    for (var i = 0; i < data.Data.length; i++) {
                        $("#City").append("<option value='" + data.Data[i].RegionCode + "'>" + data.Data[i].RegionName + "</option>")
                    };
                    $('#City').addClass("show-tick").selectpicker();
                    $('#City').selectpicker("refresh");

                }
            })
        });

        //获取区域列表（县）
        $("#City").change(function () {
            var value = this.value
            $.post("/Organization/RegionList", { parentCode: value }, function (data) {
                if (data.Flag) {
                    $("#Country").empty();
                    $("#Country").append("<option value=''>请选择县</option>");
                    for (var i = 0; i < data.Data.length; i++) {
                        $("#Country").append("<option value='" + data.Data[i].RegionCode + "'>" + data.Data[i].RegionName + "</option>")
                    };
                    $('#Country').addClass("show-tick").selectpicker();
                    $('#Country').selectpicker("refresh");

                }
            })
        });

        //地区选择第三级选定后将地址信息保存至区域字段隐藏域
        $("#Country").change(function () {
            value = this.value;
            $("#Address").val($("#Province").val() + "," + $("#City").val() + "," + value);
        });

        $("#Province").change();//加载地区列表
    });
</script>
